<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('选择备案公司')" />
</head>
<style>
/*     .layui-inline{margin-right: 20px !important;} */
</style>
<body>
<form>
<div style="padding: 0 10px;">
	<div class="north">
		<div class="layui-form-item">
             <div class="layui-inline" style="width:35%">
                 <label class="layui-form-label" style="padding: 9px 0;width:57px">公司简称</label>
                 <div class="layui-input-block" style="margin-left: 68px;">
                     <input id="vGsJc" type="text" name="vGsJc" autocomplete="off" class="layui-input">
                 </div>
             </div>
             <div class="layui-inline" style="width:30%">
                 <label class="layui-form-label" style="padding: 9px 0;width:57px">公司编码</label>
                 <div class="layui-input-block" style="margin-left: 68px;">
                     <input id="vGsBm" type="text" name="vGsBm" autocomplete="off" class="layui-input">
                 </div>
             </div>
             <div class="layui-inline" style="line-height: 34px;">
                 <a class="layui-btn layuiadmin-btn-order layui-table-tools" id="btn-search">查询</a>
                 <button type="reset" class="layui-btn layui-btn-primary layui-table-tools" >重置</button>
             </div>
         </div>
	</div>
	<div class="south">
		<div class="left">
			<div th:style="${pagetype == 'checkbox'}?'float:left;width:45%':'float:left;width:100%'"><table class="layui-hide" id="dhtable" lay-filter="ftable"></table></div>
			<div class="layui-btn-container" style="width: 50px;text-align: center;margin-top:10%;float:left;" th:if="${pagetype == 'checkbox'}">
		        <div class="layui-btn addbtn layui-btn-disabled" style="padding:0 10px;margin-right: 0;">
		            <p class="layui-icon layui-icon-next" style="font-size:14px;margin:0;color:#C9C9C9"></p>
		        </div>
		        <div class="layui-btn delbtn layui-btn-disabled" style="padding:0 10px;margin-right: 0;">
		            <p class="layui-icon layui-icon-prev" style="font-size:14px;margin:0;color:#C9C9C9"></p>
		        </div>
			</div>
			<div style="float:left;width:45%"><table class="layui-hide" id="dhtable2" lay-filter="ftable2" th:if="${pagetype == 'checkbox'}"></table></div>
		</div>
	</div>
</div>
</form>
<th:block th:include="include :: footer" />
<script>
	/*<![CDATA[*/
	var pagetype = "[[${pagetype}]]";
	var selectedUser = "[[${selectedUser}]]";

	/*]]>*/
	if(pagetype=="checkbox"){
		var typeobj = {type: 'checkbox'}
	}else{
		var typeobj = {type: 'radio'}
	}
    layui.use(['table','layer','jquery'], function () {
        var $ = layui.$,layer = layui.layer,table = layui.table,form = layui.form;

        $.tablelist.init({
            elem: '#dhtable'
            ,url: '/hr/operatecompanyapply/operatecompanyinfo/list2?'
            ,cols: [[
                {type:'numbers', fixed: 'left'}
                ,typeobj
                ,{field:'vGsJc', title: '公司简称',align: 'center'}
                ,{field:'vGsBm', title: '公司编码',align: 'center'}
            ]
            ]
            ,height:300
        });


		//双击行事件
	    table.on('rowDouble(ftable)', function(obj){
	    	var data = [obj.data];
	    	$.each(data,function(i,v){
	        	var flag = false;
	        	for(var j=0; j < dataStr.length; j++){
	        		if(v.vGsBm == dataStr[j].vGsBm)flag = true;
	        	}
	        	if(!flag)dataStr.push(v);	//排除已选中
	        });
	    	table.reload('dhtable2',{data:dataStr});

        });

		//双击删除表二
	    table.on('rowDouble(ftable2)', function(obj){
	    	var data = [obj.data];
	    	$.each(data,function(i,v){
	    		for(var j=0; j < dataStr.length; j++){
	    			if(v.vGsBm == dataStr[j].vGsBm)dataStr.splice(j,1);
	    		}
	    	});
	    	table.reload('dhtable2',{data:dataStr});
	    })

		if(pagetype=="checkbox"){
			//点击table行选中复选框
			$(document).on("click",".layui-table-body table.layui-table tbody tr",function(){
		        var obj = event ? event.target : event.srcElement;
		        var tag = obj.tagName;
		        var checkbox = $(this).find("td div.laytable-cell-checkbox div.layui-form-checkbox I");
		        if(checkbox.length!=0){
		            if(tag == 'DIV') {
		                checkbox.click();
		            }
		        }
		    });
			//点击复选框阻止冒泡
		    $(document).on("click",".layui-form-checkbox",function(e){
		        e.stopPropagation();
		        var data = [], data2 = [];
		        var checkStatus = table.checkStatus('dhtable');
		           data = checkStatus.data;
		        if(data.length > 0){$(".addbtn").removeClass("layui-btn-disabled");$(".addbtn").children().css('color','#fff');}else{$(".addbtn").addClass("layui-btn-disabled");$(".addbtn").children().css('color','#C9C9C9');}
		        var checkStatus2 = table.checkStatus('dhtable2');
		           data2 = checkStatus2.data;
		        if(data2.length > 0){$(".delbtn").removeClass("layui-btn-disabled");$(".delbtn").children().css('color','#fff');}else{$(".delbtn").addClass("layui-btn-disabled");$(".delbtn").children().css('color','#C9C9C9');}
		    });
		}else{
			table.on('row(ftable)', function(obj){
//	             obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');//选中行样式
            	obj.tr.find('input[lay-type="layTableRadio"]').prop("checked",true);

	            var index = obj.tr.data('index')
	            var thisData = table.cache.dhtable;	//dhtable 表名
	            //重置数据单选属性
	            layui.each(thisData, function(i, item){
	           		if(index === i){
	                    item.LAY_CHECKED = true;
	            	} else {
	                	delete item.LAY_CHECKED;
	            	}
	            });
	            form.render('radio');
	        });
		}
        $('#btn-search').on('click', function () {
            var vGsJc = $("#vGsJc").val();
            var vGsBm = $("#vGsBm").val();
            table.reload('dhtable', {url: "/hr/operatecompanyapply/operatecompanyinfo/list2?"+"vGsJc="+vGsJc+"&vGsBm="+vGsBm,page:{curr: 1}});
        });
    });
    $('.addbtn').click(function(){
    	var checkStatus = table.checkStatus('dhtable'),data = [];
           data = checkStatus.data;
       	$.each(data,function(i,v){
       		var flag = false;
       		for(var j=0; j < dataStr.length; j++){
    			if(v.vGsBm == dataStr[j].vGsBm)flag = true;
    		}
       		if(!flag)dataStr.push({'vGsBm':v.vGsBm,'vGsJc':v.vGsJc});	//排除已选中
       	});
       	rend();
       	$('div.laytable-cell-checkbox').find('div.layui-form-checked').click();
       	$(".addbtn").addClass("layui-btn-disabled");$(".addbtn").children().css('color','#C9C9C9');
    })
    $('.delbtn').click(function(){
    	var checkStatus = table.checkStatus('dhtable2'),data = [];
        data = checkStatus.data,objId = [];
    	$.each(data,function(i,v){
    		for(var j=0; j < dataStr.length; j++){
    			if(v.vGsBm == dataStr[j].vGsBm)dataStr.splice(j,1);
    		}
    	});
    	rend();
    	$(".delbtn").addClass("layui-btn-disabled");$(".delbtn").children().css('color','#C9C9C9');
    })
    var callbackdata = function () {
    	if(pagetype=="checkbox"){
            return dataStr;
    	}else{
    		var checkStatus = table.checkStatus('dhtable')
            ,data = checkStatus.data[0];//单选情况下只会返回一个
    		return data;
    	}
    }
    var dataStr = [];
    $(function(){
        console.log("selectedUser", selectedUser);
        getData("/hr/operatecompanyapply/listselect?selectedUser="+selectedUser);
    })
	//获取数据
    function getData(url){
    	$.get(url,function(data,status){
    		if(data.count == 0){
    			dataStr=[];rend();
    		}else{
				dataStr = [];
    			for(var i=0;i<data.data.length;i++){
    				dataStr.push(data.data[i])
    				if(i==data.data.length-1){
    					rend();
    				}
    			}
    		}
    	});
    }
    //渲染表格
    function rend(){
        $.tablelist.init({
            elem: '#dhtable2'
            ,cols: [[
                {type:'numbers', fixed: 'left'}
                ,typeobj
                ,{field:'vGsJc', title: '公司简称',align: 'center'}
                ,{field:'vGsBm', title: '公司编码',align: 'center'}
            ]
            ]
        	,data:dataStr
            ,height:300
        });
    }
</script>
</body>
</html>